<!--
 * @Author: your name
 * @Date: 2022-03-09 09:22:37
 * @LastEditTime: 2022-03-09 09:38:34
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85dianjieanniu
 * @FilePath: \day09\1-事件.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        window.onload=function(){  //延迟代码的执行  最后才被调用
              //function test(){}写在里面会报错  
              var div=document.getElementsByTagName('div')[0];
              var  btn=document.getElementById('btn');
              btn.onclick=function(){
                  div.innerText='我被点击了';
                  div.style.height='200px';
                  div.style.width='200px';
                  div.style.backgroundColor="pink";
              }
              
        }
         function test(){
                alert('我被点击了');
                console.log('我被点了');
            }
    </script>
</head>
<body>
    <!-- 事件由三部分  事件源：目标对象   2事件类型 ：点击事件  鼠标事件 键盘事件   3事件处理程序：函数 -->
    <div  id="one"  onclick="alert(1)">点击我这个div</div>
  <!--   <button id="btn" onclick="test()">点击俺妞妞</button> -->
    <button id="btn" onclick="test()">点击俺妞妞</button>
 
 
</body>
</html>